<!DOCTYPE html>
<html>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no" />
    <meta name="viewport" content="width=device-width,target-densitydpi=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <title>预约成功详情</title>
    <link rel="stylesheet" href="../plugin/bootstrap/bootstrap.min.css" />
    <!--字体-->
    <link rel="stylesheet" href="../plugin/font-awesome/css/font-awesome.css">
    <link rel="stylesheet" href="../plugin/ionicon/css/ionicons.min.css">
    <link rel="stylesheet" href="../plugin/sweetalert/sweet-alert.min.css">
    <!--my-css-->
    <link rel="stylesheet" href="css/style.css">
    <script src="../plugin/jquery/jquery.min.js"></script>
    <script src="../plugin/bootstrap/bootstrap.min.js"></script>
    <script src="../plugin/sweetalert/sweet-alert.min.js"></script>
    <script src="../common/js/system.js"></script>
    <script src="../plugin/juicer/juicer-min.js"></script>
    <!--my-js-->
    <script src="js/success_detail.js"></script>
	<body class="spec-body">
		<script type="text/template" id="tpl">
			<div class="container-fluid back-img name-relative">
	        	<img src="${topImg}" class="img-responsive center-block">
				<span class="close-icon">x</span>
	    	</div>
	    	<div class="container-fluid text-center">
	    		<h3>您已预约成功</h3>
	    	</div>
	    	<div class="container-fluid table-container">
	            <div class="table-responsive">
	                <table class="table table-bordered">
	                    <tbody>
		                    <tr class="text-center">
		                    	<p class="text-center detail-p">预约详情</p>
		                    </tr>
		                    <tr>
		                        <td class="text-center left-td">车型</td>
		                        <td class="text-center right-td relative-td">${carStyle}<button data-toggle="modal" data-target=".bs-example-modal-lg">配置</button></td>
		                    </tr>
		                    <tr>
		                        <td class="text-center left-td">预约时间</td>
		                        <td class="text-center right-td">${date}</td>
		                    </tr>
		                    <tr>
		                        <td class="text-center left-td">预约城市</td>
		                        <td class="text-center right-td">${city}</td>
		                    </tr>
		                    <tr>
		                        <td class="text-center left-td">状态</td>
		                        <td class="text-center right-td cancel-parent">${status}<button class="cancel">取消</button></td>
		                    </tr>
	                    </tbody>
	                </table>
	            </div>
	        </div>
	        <div class="container-fluid text-center">
	        	<h4>详情咨询客服电话:010-59767214</h4>
	        </div>
	        <!--详情配置模态框-->
	        <div class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel">
	            <div class="modal-dialog modal-lg">
	                <div class="modal-content">
	                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
	                    <img src="${modalImg}">
	                </div>
	            </div>
	        </div>
		</script>
	</body>
</html>
